<template>
  <view class="publish-container">
    <el-tabs v-model="activeTab">
      <el-tab-pane label="发布壁纸" name="wallpaper">
        <WallpaperForm v-if="activeTab === 'wallpaper'" />
      </el-tab-pane>
      <el-tab-pane label="发布专辑" name="album">
        <AlbumForm v-if="activeTab === 'album'" />
      </el-tab-pane>
    </el-tabs>
  </view>
</template>

<script setup>
import { ref } from 'vue'
import WallpaperForm from './components/WallpaperForm.vue'
import AlbumForm from './components/AlbumForm.vue'

const activeTab = ref('wallpaper')
</script>

<style lang="scss" scoped>
.publish-container {
  padding: 20px;
  display: flex;
  flex-direction: column;
  align-items: center;

  .el-tabs {
    width: 100%;
    max-width: 800px;
  }
}
</style>
